<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt" %>

<div class="main-content">
    <div class="box box-main">
        <form id="warningGroupForm" model="post" action="<c:url value="/web/wuhan/warningGroup/executeWarningGroupEdit.action"/>" method="post" class="form-horizontal">
            <div class="box-body">
                <div class="form-unit">基本信息</div>
                <input type="hidden" id="warningGroupId" name="id" value="${warningGroup.id}"/>
                <div class="row">
                    <div class="col-xs-12">
                        <div class="form-group">
                            <label class="control-label col-sm-4" title="">
                                <span class="required ">*</span> 报警组名称：<i class="fa icon-question hide"></i></label>
                            <div class="col-sm-8">
                                <input id="name" name="name" class="form-control required " value="${warningGroup.name}">
                            </div>
                        </div>
                    </div>
                </div>
                <div class="row">
                    <div class="col-xs-12">
                        <div class="form-group">
                            <label class="control-label col-sm-4" title="">
                                <span class="required ">*</span> 报警组编号：<i class="fa icon-question hide"></i></label>
                            <div class="col-sm-8">
                                <input id="code" name="code" class="form-control required " value="${warningGroup.code}">
                            </div>
                        </div>
                    </div>
                </div>
                <div class="row">
                    <div class="col-xs-12">
                        <div class="form-group">
                            <label class="control-label col-sm-4" title="">
                                <span class="required ">*</span> 所属区域：<i class="fa icon-question hide"></i></label>
                            <div class="col-sm-8">
                                <input id="select_reportArea" name="select_reportArea" class="form-control required ">
                            </div>
                        </div>
                    </div>
                </div>
            </div>

            <div class="box-body">
                <div class="form-unit">报警组人员</div>
                <div class="row" style="margin:0!important;">
                    <div id="menuTrees" style="width: 100%;"></div>
                    <input type="hidden" name="treesData" id="treesData" value=""/>
                    <script id="menuTpl" type="text/template">
                        <div class="pull-center" style="padding:0 15px;min-width:300px;">
                            <div class="box box-solid" style="background:#FAFAFA">
                                <div class="box-header">
                                    <div class="box-title icheck">
                                        <label><input type="checkbox" id="checkall_{{d.key}}"
                                                      class="checkall"/> 全部</label>
                                    </div>
                                    <div class="box-tools pull-right" style="top:8px;">
                                        <a class="btn btn-box-tool" id="expand_{{d.key}}"
                                           value="menuTree_{{d.key}}">展开</a>/<a
                                            class="btn btn-box-tool" id="collapse_{{d.key}}"
                                            value="menuTree_{{d.key}}">折叠</a>
                                    </div>
                                </div>
                                <div class="box-body">
                                    <div id="menuTree_{{d.key}}" class="ztree"></div>
                                </div>
                            </div>
                        </div>
                    </script>
                </div>
            </div>
            <div class="box-footer">
                <div class="row">
                    <div class="col-sm-offset-2 col-sm-10">
                        <button type="submit" class="btn btn-sm btn-primary" id="btnSubmit"><i class="fa fa-check"></i> 保 存</button>&nbsp;

                        <button type="button" class="btn btn-sm btn-default" id="btnCancel" onclick="closeView()"><i class="fa fa-times"></i> 关 闭</button>
                    </div>
                </div>
            </div>
        </form>
    </div>
</div>
<script>
    $("#warningGroupForm").validate({
        submitHandler: function(form){
            if (!validateMagicSuggest({
                select_reportArea: '不能为空'
            })) return false;
            getData();
            js.ajaxSubmitForm($(form), function(data){
                js.showMessage(data.msg);
                if(data.status == Global.NO){
                    closeView();
                    $('#dataGrid').dataGrid("refresh");
                }
            }, "json");
        }
    });

    function closeView() {
        layer.close(LayWin['wWarningGroup']);
    }


    var select_reportArea = $('#select_reportArea').magicSuggest({
        allowFreeEntries: false,
        data: '<c:url value="/web/admin/area/getAreaSelect.action?id=${warningGroup.reportArea.id}" />',
        queryParam: 'q',
        valueField: "value",
        displayField: "text",
        maxSelection: 1,
        noSuggestionText: '',
        placeholder: '请选择',
        required: true,
        autoSelect: true,
        selectFirst: true,
        value: magicSuggestValue('${warningGroup.reportArea.id}')
    });
    $(select_reportArea).on('selectionchange', function(e,m){
        validateMagicReload();
    });

    //加载数据权限树结构
    var setting = {
        check: {enable: true, nocheckInherit: true, chkboxType: {"Y": "ps", "N": "ps"}},
        view: {selectedMulti: false, nameIsHTML: true},
        data: {simpleData: {enable: true}, key: {title: "title"}},
        callback: {
            beforeClick: function (treeId, treeNode, clickFlag) {
                var tree = $.fn.zTree.getZTreeObj(treeId);
                tree.checkNode(treeNode, !treeNode.checked, true, true);
                return false;
            },
            onCheck: function (event, treeId, treeNode) {
                var tid = treeNode.tId;
                if (!treeNode.checked) {
                    $(".checkall[value=" + treeId + "]").each(function () {
                        if (this.checked) {
                            $(this).removeAttr("checked").iCheck('update');
                        }
                        return false;
                    });
                }
            }
        }
    };

    var menuTrees = {}; // 用sysCode分类存储所有菜单树
    var code="default";
    $.ajax({
        type: 'POST',
        url: "<c:url value="/web/wuhan/warningGroupInnerUser/getWarningGroupInnerUserTree.action"/>",
        data: {
            sysCode:code,
            warningGroupId:$("#warningGroupId").val()
        },
        dataType: 'json',
        async: false,
        error: function (data) {
            js.showErrorMessage(data.responseText);
        },
        success: function (html, status, xhr) {
            var data=html.data;
            for (var sysCode in data.menuMap) {
                var menuMap = data.menuMap[sysCode];
                $('#menuTrees').append(js.template('menuTpl', {
                    key: sysCode,
                    label: sysCode
                }));
                // 初始化树结构
                var tree = $.fn.zTree.init($("#menuTree_" + sysCode), setting, menuMap);
                // 展开第一级节点
                var nodes = tree.getNodesByParam("level", 0);
                for (var i = 0; i < nodes.length; i++) {
                    tree.expandNode(nodes[i], true, false, false);
                }
                // 展开第二级节点
                nodes = tree.getNodesByParam("level", 1);
                for (var i = 0; i < nodes.length; i++) {
                    tree.expandNode(nodes[i], true, false, false);
                }
                // 默认展开全部节点
                //tree.expandAll(true);
                // 树结构：全选、取消全选
                $('#checkall_' + sysCode).iCheck({
                    checkboxClass: 'icheckbox_minimal-grey'
                }).on('ifChecked ifUnchecked', function () {
                    var sysCode = $(this).attr('sysCode');
                    if (this.checked) {
                        menuTrees[sysCode].checkAllNodes(true);
                    } else {
                        menuTrees[sysCode].checkAllNodes(false);
                    }
                }).attr("sysCode", sysCode);
                // 展开和折叠按钮绑定
                $('#expand_' + sysCode).click(function () {
                    var sysCode = $(this).attr('sysCode');
                    menuTrees[sysCode].expandAll(true);
                }).attr("sysCode", sysCode);
                $('#collapse_' + sysCode).click(function () {
                    var sysCode = $(this).attr('sysCode');
                    menuTrees[sysCode].expandAll(false);
                }).attr("sysCode", sysCode);
                // 将树对象存储到全局数组里
                menuTrees[sysCode] = tree;
            }
            // 默认选择节点
            for (var idx in data.roleMenuList) {
                var roleMenu = data.roleMenuList[idx];
                var sysCode = roleMenu.sysCode;
                var node = menuTrees[sysCode].getNodeByParam("id", roleMenu.menuCode);
                try {
                    menuTrees[sysCode].checkNode(node, true, false);
                } catch (e) {
                }
            }
        }
    });

    function getData() {
        var treeData = new Array();
        var zTreeObj = $.fn.zTree.getZTreeObj("menuTree_" + code);
        var checkedNodes = zTreeObj.getCheckedNodes();
        $.each(checkedNodes, function (i, val) {
            treeData.push(val.id)
        });
        $("#treesData").val(treeData);
    }
</script>


